<style>
    .project_role .icon_font{width: 30px;height: 30px;border-radius: 30px;text-align: center;}
    .project_role .iconfont{font-size: 26px;color: #fff;}
    .project_role .iconfont.icon-quanminyingxiao{font-size: 18px;}
    .role_tip{background-color: #f2f2f2;padding: 0 20px;line-height: 26px;margin: 2px 15px;border-radius: 15px;}
    .table-wrap{border-bottom: none;}
    .project_role .iconfont.icon-5003{font-size: 18px;}
</style>
<div ng-controller="roleCommonCtrl">
    <div class="mt20">
        <div class="f14 clearfix">
            <div style="width:530px" class="fl">
                <div class="select" ui-combobox data="applicationData"
                     ng-model="filterApplication" text-field="text" value-field="code">
                </div>
            </div>
            <div class="fl pt5 pl20">
                <label class="checkbox">
                    <input type="checkbox" ng-model="filterContract">
                    <span>只显示有可用授权的合同</span>
                </label>
            </div>
        </div>

        <div class="mt20 project_role" ng-repeat="item in projAuthList | applicationFilter : filterApplication">
            <div class="lh30 clearfix">
                <div class="fl icon_font icon-bg-{{item.Application}}"><i class="iconfont icon-{{item.Application}}"></i></div>
                <span class="fl ml10 f16">{{item.FriendlyName}}</span>
                <div class="fl role_tip">
                    可用：<span class="c-orange mr10">{{calCanUseNum(item)}}</span>已用：{{calUseNum(item)}}
                </div>
            </div>
            <div class="table-wrap mt10 lh18">
                <table width="100%">
                    <thead>
                    <tr class="thead ta-l">
                        <th height="30" width="50" class="text-center"> 序号 </th>
                        <th>合同信息</th>
                        <th width="180">授权信息</th>
                        <th width="100">状态</th>
                        <th width="120" class="text-center">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="cont_item in item.contracts | contractFilter : filterContract">
                        <td height="54" class="text-center">{{$index+1}}</td>
                        <td>
                            <p>合同：{{cont_item.PartyA}}</p>
                            <p class="c-gray">租期：{{cont_item.BeginOn | limitTo:10}}至{{cont_item.EndOn | limitTo:10}} </p>
                        </td>
                        <td>
                            <p>可用：<span  class="c-orange">{{cont_item.total_num-cont_item.use_num}}</span></p>
                            <p>已用：{{cont_item.use_num}} </p>
                        </td>
                        <td>
                            {{cont_item.binding==0?'未授权':'已授权'}}
                        </td>
                        <td class="text-center">
                            <button href="javascript:;"
                                    class="btn permission p-0000200101-02-inline"
                                    ng-show="cont_item.binding==0"
                                    ng-disabled="cont_item.total_num<=cont_item.use_num||(cur_bind_mode&&!item.isZsslc&&check_can_bind().length<1)||canEdit==0"
                                    ui-confirm="确定要将当前项目绑定{{item.FriendlyName}}授权吗？<br>一旦授权成功，将会占用授权数。"
                                    ui-confirm-ok="bindAuth(item,cont_item)"
                            >绑定授权</button>
                            <button href="javascript:;"
                                    class="btn btn-yellow permission p-0000200101-02-inline"
                                    ng-show="cont_item.binding==1"
                                    ng-disabled="0==cont_item.use_num||(cur_bind_mode&&item.isZsslc&&check_can_cancel().length>0)||canEdit==0"
                                    ui-confirm="确定要将当前项目取消{{item.FriendlyName}}授权吗？"
                                    ui-confirm-ok="cancelAuth(item,cont_item)"
                            >取消授权</button>
                        </td>
                    </tr>

                    </tbody>
                </table>
            </div>
        </div>

    </div>
</div>